<template>
	<view class="my" :style="'padding-bottom:'+pdbottom+'rpx;'">
		<view class="my_top_box">
			<view class="user_info_box" @click="changeUserInfo">
				<view class="display_flex">
					<view class="user_info_name ellipsis">{{userinfo.username?userinfo.username:'点击登录'}}</view>
					<view class="ml-5">
						<image v-for="items in userinfo.honors" :key='items.honor_id'
							style="width: 60rpx;height: 60rpx;vertical-align: middle;" :src="items.pic"
							@click="goHonorInfo(item.honor_id)"></image>
					</view>
					<image class="edit_icon" :src="onlinePic+'edit_icon.png'" mode="aspectFill"></image>
				</view>
				<view class="avatar_box">
					<image class="avater_img" :src="userinfo.avatar?picUrl+userinfo.avatar:onlinePic+'avatar.png'"
						mode="aspectFill">
					</image>
					<image v-if="userinfo.avatar_border" class="my_avatar_border" :src="picUrl+userinfo.avatar_border">
					</image>
				</view>
			</view>
			<view class="my_row_box">
				<view class="text-c">
					<view :class="userinfo.bbs_count>0?'f-w f-16':'c-666666 f-16'">
						{{userinfo.bbs_count?userinfo.bbs_count:0}}
					</view>
					<view class="f-14 c-666666 mt-10">发布</view>
				</view>
				<view class="text-c">
					<view :class="userinfo.like_count>0?'f-w f-16':'c-666666 f-16'">
						{{userinfo.like_count?userinfo.like_count:0}}
					</view>
					<view class="f-14 c-666666 mt-10">点赞</view>
				</view>
				<!-- <view class="text-c">
					<view :class="userinfo.follows_count>0?'f-w f-16':'c-666666 f-16'">
						{{userinfo.follows_count?userinfo.follows_count:0}}
					</view>
					<view class="f-14 c-666666 mt-10">关注</view>
				</view>
				<view class="text-c">
					<view :class="userinfo.fans_count>0?'f-w f-16':'c-666666 f-16'">
						{{userinfo.fans_count?userinfo.fans_count:0}}
					</view>
					<view class="f-14 c-666666 mt-10">粉丝</view>
				</view> -->
			</view>
		</view>
		<view class="my_cell_box">
			<view v-if="userinfo.is_staff==1" class="group_public_btn_block mt-30"
				@click="goGroupManage('/pages/groupmanage/groupmanage','车友会管理')">车友会管理</view>
			<view v-if="userinfo.is_staff==2" class="group_public_btn_block mt-30"
				@click="goGroupManage('/pages/groupmanage/groupmanage','活动审核管理')">活动审核管理</view>

			<view class="my_cell" @click="goPage('/pages/signin/signin','我的签到')">
				<view class="f-14 display_flex">
					<view>我的签到</view>
					<!-- <view class="my_cell_dot"></view> -->
				</view>
				<uni-icons type="right" size="18" color="#D5D5D5"></uni-icons>
			</view>
			<view class="my_cell" @click="goPage('/pages/taskcentre/index','我的油滴')">
				<view class="f-14 display_flex">
					<view>我的油滴</view>
				</view>
				<uni-icons type="right" size="18" color="#D5D5D5"></uni-icons>
			</view>
			<view class="my_cell" @click="goPage('/pages/my/myactive','我的活动')">
				<view class="f-14 display_flex">
					<view>我的活动</view>
					<!-- <view class="my_cell_dot"></view> -->
				</view>
				<uni-icons type="right" size="18" color="#D5D5D5"></uni-icons>
			</view>
			<view class="my_cell" @click="goPage('/pages/my/mydriverlist','我的预约试驾')">
				<view class="f-14 display_flex">
					<view>我的预约试驾</view>
					<!-- <view class="my_cell_dot"></view> -->
				</view>
				<uni-icons type="right" size="18" color="#D5D5D5"></uni-icons>
			</view>
			<view class="my_cell" @click="goPage('/pages/my/mygroups','我的车友会')">
				<view class="f-14 display_flex flex-1">
					<view>我的车友会</view>
					<view v-if="userinfo.club_join_perfect_status==1" class="my_cell_dot"></view>
				</view>
				<view v-if="userinfo.club_join_perfect_status==1" class="f-12">{{userinfo.club_join_perfect_text1}}
				</view>
				<uni-icons type="right" size="18" color="#D5D5D5"></uni-icons>
			</view>
			<!-- <view class="my_cell" v-if="userinfo.is_staff>0" @click="goGroupManage()">
				<view class="f-14 display_flex">
					<view>车友会管理</view>
				</view>
				<uni-icons type="right" size="18" color="#D5D5D5"></uni-icons>
			</view> -->
			<view class="my_cell" @click="goPage('/pages/my/mypost','我的发布')">
				<view class="f-14 display_flex">
					<view>我的发布</view>
					<view class="my_cell_dot" v-if="userinfo.msg_comment_number>0"></view>
				</view>
				<uni-icons type="right" size="18" color="#D5D5D5"></uni-icons>
			</view>
			<!-- <view class="my_cell" @click="goPage('/pages/my/mycard')">
				<view class="f-14 display_flex">
					<view>我的名片</view>
				</view>
				<uni-icons type="right" size="18" color="#D5D5D5"></uni-icons>
			</view> -->
			<view class="my_cell" @click="goPage('/pages/my/mymessage','我的消息')">
				<view class="f-14 display_flex">
					<view>我的消息</view>
					<view class="my_cell_dot" v-if="userinfo.msg_number>0"></view>
				</view>
				<uni-icons type="right" size="18" color="#D5D5D5"></uni-icons>
			</view>
		</view>
		<tab-Bar :tabbarnum="3" :myNoticeNum="isDot" :random="random"></tab-Bar>
	</view>
</template>

<script>
	import {
		getGroupUserInfo,
	} from '@/api/motortime.js';
	let app = getApp()
	export default {
		data() {
			return {
				user_id: '',
				userinfo: '',
				isDot: 0,
				msg_number: 0,
				sign_status: uni.getStorageSync('clubconfig') ? uni.getStorageSync('clubconfig').sign_status : 0,
				msg_comment_number: 0,
				picUrl: app.globalData.picUrl,
				onlinePic: app.globalData.onlinePic,
				pdbottom: uni.getSystemInfoSync().safeAreaInsets.bottom ? uni.getSystemInfoSync().safeAreaInsets.bottom +
					130 : 130,
			};
		},
		onShow() {
			this.sign_status = uni.getStorageSync('clubconfig') ? uni.getStorageSync('clubconfig').sign_status : 0
			if (uni.getStorageSync('access_token')) {
				this.user_id = uni.getStorageSync('userinfo').user_id
				this.getGroupUserInfo()
			}
			if (uni.getStorageSync('myload')) {
				uni.removeStorage({
					key: 'myload'
				})
			}

		},
		onLoad() {
			
			if (!uni.getStorageSync('access_token')) {
				uni.navigateTo({
					url: '/pages/login/login'
				})
			}
			var params = {
				event_code: '我的',
				path: 'pages/my/my',
				event_id: '',
				title: '',
				source_page: '',
				value: '',
			}
			app.BurialPoint(params)
			uni.hideTabBar()
		},
		methods: {
			getGroupUserInfo() {
				getGroupUserInfo({
					user_id: uni.getStorageSync('userinfo') ? uni.getStorageSync('userinfo').user_id : ''
				}).then(res => {
					if (res.state == 1) {
						this.userinfo = res.data.list
						this.msg_number = res.data.list.msg_number
						this.msg_comment_number = res.data.list.msg_comment_number
						if (res.data.list.msg_number > 0 || res.data.list.msg_comment_number) {
							this.isDot = 1
						} else {
							this.isDot = 0
						}
						uni.setStorage({
							key: 'userinfo',
							data: res.data.list,
							success: function() {

							}
						});
						if (res.data.list.mobile == '') {
							uni.navigateTo({
								url: '/pages/login/login'
							})
						}
					} else {
						uni.removeStorage({
							key: 'access_token'
						})
					}
				})
			},
			changeUserInfo() {
				var params = {
					event_code: '我的',
					path: 'pages/my/my',
					event_id: '',
					title: '',
					source_page: '点击用户名',
					value: '',
				}
				app.BurialPoint(params)
				if (uni.getStorageSync('access_token')) {
					uni.navigateTo({
						url: '/pages/my/editmyinfo'
					})
				} else {
					uni.navigateTo({
						url: '/pages/login/login'
					})
				}
			},
			goPage(url, name) {
				var params = {
					event_code: '我的',
					path: 'pages/my/my',
					event_id: '',
					title: '',
					source_page: '点击跳转-' + name,
					value: '',
				}
				app.BurialPoint(params)
				if (uni.getStorageSync('access_token')) {
					uni.navigateTo({
						url: url
					})
				} else {
					uni.navigateTo({
						url: '/pages/login/login'
					})
				}
			},
			goGroupManage(url, name) {
				var params = {
					event_code: '我的',
					path: 'pages/my/my',
					event_id: '',
					title: '',
					source_page: '点击跳转-' + name,
					value: '',
				}
				app.BurialPoint(params)
				if (uni.getStorageSync('access_token')) {
					var staff_club_id = uni.getStorageSync('userinfo') ? uni.getStorageSync('userinfo').staff_club_id : 0
					uni.navigateTo({
						url: url + '?club_id=' + staff_club_id
					})
				} else {
					uni.navigateTo({
						url: '/pages/login/login'
					})
				}

			}
		},
	}
</script>

<style lang="scss">
	.my {
		.my_top_box {
			padding: 0 50rpx;
			background: linear-gradient(to bottom, #FFFFFF, #F9F9F9);

			.user_info_box {
				padding: 80rpx 0 60rpx 0;
				display: flex;
				align-items: center;
				justify-content: space-between;

				.user_info_name {
					font-size: 36rpx;
				}

				.edit_icon {
					width: 30rpx;
					height: 30rpx;
					margin-left: 10rpx;
				}

				.avatar_box {
					// 框150x150，头像120x120 :框和头像的比例是5：4 
					width: 150rpx;
					height: 150rpx;
					display: flex;
					align-items: center;
					justify-content: center;
					position: relative;

					.avater_img {
						width: 120rpx;
						height: 120rpx;
						border-radius: 100%;
					}

					.my_avatar_border {
						width: 150rpx;
						height: 150rpx;
						position: absolute;
						top: 0;
						right: 0;
						bottom: 0;
						left: 0;
						z-index: 1;
					}

					.avater_v_icon {
						width: 30rpx;
						height: 30rpx;
						position: absolute;
						right: 10rpx;
						bottom: 0;
						z-index: 1;
					}
				}
			}

			.my_row_box {
				display: flex;
				align-items: center;
				justify-content: space-around;
				padding-bottom: 50rpx;
			}
		}

		.my_cell_box {
			font-size: 30rpx;
			padding: 10rpx 50rpx;

			.my_cell {
				padding: 35rpx 0;
				display: flex;
				align-items: center;
				justify-content: space-between;
				border-bottom: 1rpx solid #F1F1F1;

				.my_cell_dot {
					width: 12rpx;
					height: 12rpx;
					margin-left: 15rpx;
					background-color: #F84949;
					border-radius: 50rpx;
				}
			}

			.my_cell:last-child {
				border-bottom: none;
			}
		}
	}
</style>